<!--
 售后部前台衍生信息
 -->
<template>
  <div>
    <el-form :model="form" :inline="true" label-width="100px">
      <el-row>
        <el-col :span="4.5">
          <el-form-item label="选择售后人员" prop="userId">
            <el-select v-model="form.userId" placeholder="请选择">
              <el-option v-for="item in shouhou" :key="item.id" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <div class="block" style="margin-left: 20px;">
          <span class="demonstration">选择时间范围</span>
          <el-date-picker
            v-model="value1"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期">
          </el-date-picker>
        <el-button type="primary" @click="saveC">查询</el-button>
        </div>
      </el-row>
    </el-form>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="" label="售后服务衍生收入合计" ></el-table-column>
      <el-table-column prop="" label="售后服务衍生成本合计" ></el-table-column>
      <el-table-column prop="" label="售后服务衍生毛利合计" ></el-table-column>
      <el-table-column prop="" label="售后服务衍生毛利率" ></el-table-column>
      <el-table-column prop="" label="续保交强险收入" ></el-table-column>
      <el-table-column prop="" label="续保交强险成本" ></el-table-column>
      <el-table-column prop="" label="续保交强毛利" ></el-table-column>
      <el-table-column prop="" label="续保交强毛利率" ></el-table-column>
      <el-table-column prop="" label="续保商业险收入" ></el-table-column>
      <el-table-column prop="" label="续保商业险成本" ></el-table-column>
    </el-table>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="" label="续保商业毛利" ></el-table-column>
      <el-table-column prop="" label="续保商业毛利率" ></el-table-column>
      <el-table-column prop="" label="售后延保收入" ></el-table-column>
      <el-table-column prop="" label="售后延保成本" ></el-table-column>
      <el-table-column prop="" label="售后延保毛利" ></el-table-column>
      <el-table-column prop="" label="售后延保毛利率" ></el-table-column>
      <el-table-column prop="" label="售后代办年审收入" ></el-table-column>
      <el-table-column prop="" label="售后代办年审成本" ></el-table-column>
      <el-table-column prop="" label="售后代办年审毛利" ></el-table-column>
      <el-table-column prop="" label="售后代办年审毛利率" ></el-table-column>
    </el-table>
    </el-table>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="" label="售后专业衍生收入合计" ></el-table-column>
      <el-table-column prop="" label="售后专业衍生成本合计" ></el-table-column>
      <el-table-column prop="" label="售后专业衍生毛利合计" ></el-table-column>
      <el-table-column prop="" label="售后专业衍生毛利率" ></el-table-column>
      <el-table-column prop="" label="售后精品销售收入" ></el-table-column>
      <el-table-column prop="" label="售后精品销售成本" ></el-table-column>
      <el-table-column prop="" label="售后精品销售毛利" ></el-table-column>
      <el-table-column prop="" label="售后精品销售毛利率" ></el-table-column>
      <el-table-column prop="" label="售后养护品收入" ></el-table-column>
      <el-table-column prop="" label="售后养护品成本" ></el-table-column>
    </el-table>
    </el-table>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="" label="售后养护品毛利" ></el-table-column>
      <el-table-column prop="" label="售后养护品毛利率" ></el-table-column>
      <el-table-column prop="" label="售后保养套餐收入" ></el-table-column>
      <el-table-column prop="" label="售后保养套餐成本" ></el-table-column>
      <el-table-column prop="" label="售后保养套餐毛利" ></el-table-column>
      <el-table-column prop="" label="售后保养套餐毛利率" ></el-table-column>
      <el-table-column prop="" label="售后洗美收入" ></el-table-column>
      <el-table-column prop="" label="售后洗美成本" ></el-table-column>
      <el-table-column prop="" label="售后洗美毛利" ></el-table-column>
      <el-table-column prop="" label="售后洗美毛利率" ></el-table-column>
    </el-table>
    </el-table>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="" label="续保交强险目标台数" ></el-table-column>
      <el-table-column prop="" label="续保交强险实际台数" ></el-table-column>
      <el-table-column prop="" label="续保交强险目标达成率" ></el-table-column>
      <el-table-column prop="" label="续保商业险目标台数" ></el-table-column>
      <el-table-column prop="" label="续保商业险实际台数" ></el-table-column>
      <el-table-column prop="" label="续保商业险目标达成率" ></el-table-column>
      <el-table-column prop="" label="售后延保销售目标台数" ></el-table-column>
      <el-table-column prop="" label="售后延保销售实际台数" ></el-table-column>
      <el-table-column prop="" label="售后延保销售目标达成率" ></el-table-column>
      <el-table-column prop="" label="售后代办年审目标台数" ></el-table-column>
    </el-table>
    </el-table>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="" label="售后代办年审实际台数" ></el-table-column>
      <el-table-column prop="" label="售后代办年审目标达成率" ></el-table-column>
      <el-table-column prop="" label="售后精品销售目标收入" ></el-table-column>
      <el-table-column prop="" label="售后精品销售实际收入" ></el-table-column>
      <el-table-column prop="" label="售后精品销售目标达成率" ></el-table-column>
      <el-table-column prop="" label="售后养护品销售目标数量" ></el-table-column>
      <el-table-column prop="" label="售后养护品销售实际数量" ></el-table-column>
      <el-table-column prop="" label="售后养护品销售目标达成率" ></el-table-column>
      <el-table-column prop="" label="售后保养套餐销售目标台数" ></el-table-column>
      <el-table-column prop="" label="售后保养套餐销售实际台数" ></el-table-column>
    </el-table>
    </el-table>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="" label="售后保养套餐销售目标达成率" ></el-table-column>
      <el-table-column prop="" label="售后洗美目标收入" ></el-table-column>
      <el-table-column prop="" label="售后洗美实际收入" ></el-table-column>
      <el-table-column prop="" label="售后洗美目标达成率" ></el-table-column>
      <el-table-column prop="" label="" ></el-table-column>
      <el-table-column prop="" label="" ></el-table-column>
      <el-table-column prop="" label="" ></el-table-column>
      <el-table-column prop="" label="" ></el-table-column>
      <el-table-column prop="" label="" ></el-table-column>
      <el-table-column prop="" label="" ></el-table-column>
    </el-table>

    </div>
</template>

<script>
  export default {
    data() {
      return {
        value1:null,
        form: {},
        shouhou: [],
        size: 'small',
        tableData: [{
          date: '3',
          name: '123',
        }
        ]
      }
    },
    methods: {
      saveC() {
        console.log(this.value1);
      },
      //获取销售部所有人员
      getShouHou() {
        this.$ajax.post('AccessoriesChannels/findShouHou', {}).then(res => {
          var result = res.data
          this.shouhou = result.data
        })
      }
    },
    created() {
      this.getShouHou()
    }
  }
</script>

<style>
</style>
